<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%
	request.setAttribute("path", request.getContextPath());
%>
<script type="text/javascript">
$(function(){
	addChgValitation();
	initFirstCat("firstCat","${product.product.firstCat.id}","secondCat","${product.product.secondCat.id}",false);
	chgLevel();
});

function addChgValitation(){

	$("#firstCat").change(function (){
		check.emptyCheck("firstCat");
	});

	$("#secondCat").change(function (){
		check.emptyCheck("secondCat");
	});

	$("#productName").change(function (){
		check.emptyCheck("productName");
	});

	$("#purchaseDate").change(function (){
		check.emptyCheck("purchaseDate");
	});


	$("#mandatoryLevel").change(function (){
		check.emptyCheck("mandatoryLevel");
	});


	$("#serviceType").change(function (){
		check.emptyCheck("serviceType");
	});

	$("#serviceCost").change(function (){
		check.floatNum("serviceCost");
	});

	$("#distance").change(function (){
		check.intNumAndEmpty("distance");
	});

	$("#travelCost").change(function (){
		check.floatNum("travelCost");
	});	

	$("#visitCost").change(function (){
		check.floatNum("visitCost");
	});	

	$("#otherCost").change(function (){
		check.floatNum2("otherCost");
	});		

	$("#satisfaction").change(function (){
		check.emptyCheck("satisfaction");
	});		

	$("#repairType").change(function (){
		check.emptyCheck("repairType");
	});		
		
	$("#repairDate").change(function (){
		check.emptyCheck("repairDate");
	});	
}

function validateProduct(){
	return check.emptyCheck("firstCat") &  
		   check.emptyCheck("secondCat") & 
		  check.emptyCheck("productName") &  
		  check.emptyCheck("purchaseDate");

}

function submitForm( type ,url ,formId,errMsg,succMsg,succFun){
	
	var formData = $("#"+formId).serialize();
	common.progressDialog("...提交中...");
	$.post(url, formData, function(result) {
		common.closeProgressDialog();
		 if(result.type == "0"){
			 var mvcValidtorResult = result.content;
			 for(var key in mvcValidtorResult.fieldErrors){
				 common.showClientErrorTip(key,mvcValidtorResult.fieldErrors[key]);
			 }
			 var globalMsg = mvcValidtorResult.globalMessage;
			 if(globalMsg){
				 common.modalGlobalMessage(globalMsg,"错误");  
			 }
		 } else if(result.type == "1"){
			 common.modalGlobalMessage(errMsg,"错误"); 
		 }else if(result.type == "2"){
			 common.modalGlobalMessage("系统出现异常了","系统异常");  
		 }else if(result.type == "3"){
			 if(succMsg){
				 common.moalYesNoDialog(succMsg,"成功",succFun);
			 }else{
				if(type =="user"){
					saveCustomerSucc(result.content)
				}
				if(type =="product"){
					saveProductSucc(result.content)
				}
				if(type =="order"){
					saveOrderSucc(result.content)
				}
			 }
		 }else{
			 common.modalGlobalMessage("系统出现异常了","系统异常");  
		 }
	},"json");
	
}
function saveProduct(){

	if(validateProduct()){
		var uri = "${root}/order/product/update"
			submitForm("product",uri,"productForm","保存客户产品失败","",'saveProductSucc()');
	}
}
function saveProductSucc(id){

	$("#accordionProduct").collapse('hide');
	$("#accordionOrder").collapse('show');
	$("#productId").val(id);
}
function chgLevel(){
	$("#repairCost").text($("#mandatoryLevel option:selected").attr("cost"));
	$("#mandatoryCost").val($("#mandatoryLevel option:selected").attr("cost"));
}


function validateOrder(){
    var val = $("#productId").val();
    if(common.isEmpty(val)){
    	common.modalGlobalMessage("请先设置产品信息","错误"); 
    	return false;
    }
	return  check.emptyCheck("mandatoryLevel") & 
		check.emptyCheck("serviceType") &
		check.floatNum("serviceCost") &
		check.intNumAndEmpty("distance") &
		check.floatNum("travelCost") &
		check.floatNum("visitCost") &
		check.emptyCheck("satisfaction") &
		check.emptyCheck("repairType") &
		check.floatNum2("otherCost") &
		check.emptyCheck("repairDate");
}
function saveOrder(){

	if(validateOrder()){
		var uri = "${root}/order/feedback"
			submitForm("order",uri,"orderForm","保存订单失败","",'saveOrderSucc()');
	}
}
function saveOrderSucc(id){

	common.reload("${root}/order/list/init?loc=order_list&h=h05&n=n01");
}
</script>
<jsp:include page="../base/master_js.jsp"></jsp:include>
<div class="accordion" >
  <div class="accordion-group">
    <div class="accordion-heading">
      <h4 >
        <a class="accordion-toggle" data-toggle="collapse"data-parent="#accordion" href="#accordionUser" style="padding:0px">
        	<strong>&nbsp;客户信息</strong>
        </a>
      </h4>
    </div>
    <div id="accordionUser" class="accordion-body collapse in">
      <div class="accordion-inner">
			<form class="form-horizontal" id="customerForm" role="form">
			<input type="hidden" value="${customer.id }" name="userId"/>
			<table class="table table-hover">
					<tr>
						<th>客户姓名:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${customer.name}"></c:out></span>
						</td>
						<th>手机:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${customer.mobile }"></c:out></span>
						</td>							
					</tr>
					<tr>
						<th>大区:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${customer.firstOrg.name }"></c:out></span>
						</td>
						<th>办事处:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${customer.secondOrg.name }"></c:out></span>
						</td>
					</tr>
					<tr>
						<th>客户类别:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${customer.type }"></c:out></span>
						</td>					
						<th>性别:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${customer.gender }"></c:out></span>
						</td>
					</tr>
					<tr>
						<th>地址:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${customer.address }"></c:out></span>
						</td>
						<th>邮编:</th>
						<td >
					    	<span class="input-xlarge uneditable-input"><c:out value="${customer.zip }"></c:out></span>
						</td>
					</tr>					
					<tr>
						<th>座机:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${customer.phone }"></c:out></span>
						</td>
						<th>EMAIL:</th>
						<td>
					    	<span class="input-xlarge uneditable-input"><c:out value="${customer.email }"></c:out></span>
						</td>
					</tr>
					<tr>
						<th>备注:</th>
						<td colspan="3">
							<span class="input-xlarge uneditable-input"><c:out value="${customer.comments }"></c:out></span>
						</td>
					</tr>
				</table>
			</form>
      </div>
    </div>
  </div>
  
<div class="accordion-group">
    <div class="accordion-heading">
      <h4 >
        <a class="accordion-toggle" data-toggle="collapse"data-parent="#accordion" href="#accordionProduct" style="padding:0px">
        	<strong>&nbsp;产品信息</strong>
        </a>
      </h4>
    </div>
    <div id="accordionProduct" class="accordion-body collapse">
      <div class="accordion-inner">
			<form class="form-horizontal" id="productForm" role="form">
			<input type="hidden" name="customerId" id="customerId" value="${customer.id }">
			<input type="hidden" name="id" id="id" value="${product.id }">
			<table class="table table-hover">
				<tr>
						<th>机型:</th>
						<td>
							<input type="text" class="input-xlarge" name="productName" id="productName" maxlength="50" value="${product.product.name}">
							<span class="text-error">*</span>
						</td>
						<th>购买日期:</th>
						<td>
							<input type="text" data-date="${today}"  data-date-format="yyyy-mm-dd" class="input-xlarge datepicker" id="purchaseDate" name="purchaseDate" 
							value='<fmt:formatDate value="${product.purchaseDate }" pattern="yyyy-MM-dd"/>'>
							<span class="text-error">*</span>
						</td>						
					</tr>			
				  <tr>
					<th>产品线:</th>
					<td>
						<select id="firstCat" name="firstCat" class="input-xlarge" onchange="firstCatChange(this,'secondCat')">
							<option value=""></option>
							<c:forEach var="item" items="${firstCats}">
								<option value="${item.id }"><c:out value="${item.name }"/></option>
							</c:forEach>
						</select>
						<span class="text-error">*</span>
					</td>
					<th>品牌:</th>
					<td>
						<select id="secondCat" name="secondCat" class="input-xlarge" >
						</select>
						<span class="text-error">*</span>
					</td>
				  </tr>
					<tr>
						<th>机器编号:</th>
						<td>
							<input type="text" class="input-xlarge" name="barCode" id="barCode" value="${product.barCode }" />
						</td>
						<th>保修卡号:</th>
						<td >
					    	<span class="input-xlarge uneditable-input"><c:out value="${product.mandatoryNo }"></c:out></span>
						</td>
					</tr>				  
					<tr>
						<th>购买价格:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${product.purchasePrice }"></c:out></span>
							
						</td>
						<th>发票号码:</th>
						<td >
					    	<span class="input-xlarge uneditable-input"><c:out value="${product.recepitNo }"></c:out></span>
						</td>
					</tr>					
					<tr>
						<th>售货单位:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${product.salesShop }"></c:out></span>
						</td>
						<th>售货电话:</th>
						<td >
					    	<span class="input-xlarge uneditable-input"><c:out value="${product.salesContact }"></c:out></span>
						</td>
					</tr>					
					<tr>
						<th>备注:</th>
						<td colspan="2">
							<span class="input-xlarge uneditable-input"><c:out value="${product.comments }"></c:out></span>
						</td>
						<td>
							<button type="button" class="btn btn-success" onclick="saveProduct()">保存</button>
						</td>
					</tr>
				</table>
			</form>
      </div>
    </div>
  </div>  
  
  <div class="accordion-group">
    <div class="accordion-heading">
      <h4 >
        <a class="accordion-toggle" data-toggle="collapse"data-parent="#accordion" href="#accordionOrder" style="padding:0px">
        	<strong>&nbsp;服务信息</strong>
        </a>
      </h4>
    </div>
    <div id="accordionOrder" class="accordion-body collapse">
      <div class="accordion-inner">
			<form class="form-horizontal" id="orderForm" role="form">
			<input type="hidden" name="productId" id="productId" value="${product.id}">
			<input type="hidden" name="id" id="id" value="${order.id }">
			<input type="hidden" name="repairUser" value="${userMe.id}">
			<input type="hidden" id="mandatoryCost" name="mandatoryCost" value="">
			<table class="table table-hover">
					<tr>
						<th>服务类型:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${order.type}"></c:out></span>
						</td>
						<th>紧急度:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${order.urgentLevel }"></c:out></span>
						</td>
					</tr>
					<tr>
						<th>报修人:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${order.orderUser }"></c:out></span>
						</td>					
						<th>联系电话:</th>
						<td>
							<span class="input-xlarge uneditable-input"><c:out value="${order.orderMobile }"></c:out></span>
						</td>
					</tr>
					<tr>
						<th>故障描述:</th>
						<td colspan="3">
							<span class="input-xxlarge uneditable-input"><c:out value="${order.hitchComments }"></c:out></span>
						</td>
					</tr>					
					<tr>
						<th>备注:</th>
						<td >
							<span class="input-xxlarge uneditable-input"><c:out value="${order.comments }"></c:out></span>
						</td>
						<th>预约日期:</th>
						<td>
							<span class="input-xlarge uneditable-input"><fmt:formatDate pattern="yyyy-MM-dd" value="${order.orderDate }"/></span>
						</td>							
					</tr>
					<tr>
						<th>维修等级:</th>
						<td>
							<select id="mandatoryLevel" name="mandatoryLevel" class="input-xlarge" onchange="chgLevel()">
								<c:forEach var="item" items="${mandatoryLevelList}">
									<option value="${item.id }" cost="${item.extension}" <c:if test="${order.mandatoryLevel ==  item.id}">selected</c:if>><c:out value="${item.name }"/></option>
								</c:forEach>
							</select>			
						</td>
						<th>维修费:</th>
						<td>
							<span class="input-xlarge uneditable-input" id="repairCost"></span>
						</td>						
					</tr>
					<tr>
						<th>服务方式:</th>
						<td>
							<select id="serviceType" name="serviceType" class="input-xlarge">
								<c:forEach var="item" items="${serviceTypeList}">
									<option value="${item.id }" ><c:out value="${item.name }"/></option>
								</c:forEach>
							</select>	
							<span class="text-error">*</span>		
						</td>
						<th>服务费:</th>
						<td>
							<input type="text" class="input-xlarge" name="serviceCost" id="serviceCost" maxlength="10" >	
							<span class="text-error">*</span>
						</td>						
					</tr>
					<tr>
						<th>上门里程(公里):</th>
						<td>
							<input type="text" class="input-xlarge" name="distance" id="distance" maxlength="10" >		
							<span class="text-error">*</span>	
						</td>
						<th>差旅费:</th>
						<td>
							<input type="text" class="input-xlarge" name="travelCost" id="travelCost" maxlength="10" >
							<span class="text-error">*</span>
						</td>						
					</tr>		
					<tr>
						<th>上门补贴:</th>
						<td>
							<input type="text" class="input-xlarge" name="visitCost" id="visitCost" maxlength="10" >	
							<span class="text-error">*</span>		
						</td>
						<th>其他费:</th>
						<td>
							<input type="text" class="input-xlarge" name="otherCost" id="otherCost" maxlength="10" >
						</td>						
					</tr>	
					<tr>
						<th>客户满意度:</th>
						<td>
							<select id="satisfaction" name="satisfaction" class="input-xlarge">
								<c:forEach var="item" items="${satisfactionList}">
									<option value="${item.id }" ><c:out value="${item.name }"/></option>
								</c:forEach>
							</select>			
							<span class="text-error">*</span>
						</td>
						<th>配件费:</th>
						<td>
							<span class="input-xlarge uneditable-input" id="partCost"></span>
						</td>					
					</tr>
					<tr>
						<th>是否二次维修:</th>
						<td>
							<select id="repairType" name="repairType" class="input-xlarge">
								<c:forEach var="item" items="${repairTypeList}">
									<option value="${item.id }" ><c:out value="${item.name }"/></option>
								</c:forEach>
							</select>			
							<span class="text-error">*</span>
						</td>
						<th>修复日期:</th>
						<td>
							<input type="text" data-date="${today}"  data-date-format="yyyy-mm-dd" class="input-medium datepicker" id="repairDate" name="repairDate"  >
							<span class="text-error">*</span>
						</td>					
					</tr>
					<tr>
						<th>维修备注:</th>
						<td colspan="2">
							<input type="text" class="input-xxlarge" name="repairComments" id="repairComments" maxlength="500"/>
						</td>
						<td>
							<button type="button" class="btn btn-success" onclick="saveOrder()">保存</button>
						</td>						
					</tr>
					
				</table>
			</form>
      </div>
    </div>
  </div>  
  </div>	

